<template>
	<view>
		
		 <public-header title="交接班"></public-header>
		<rList ref="rList"  :columnRowConfig="columnRowConfig" :page="config.page" :config="config" @on-grid-button="onGridButton" @on-list-item-checked="onItemChecked" :searchValKey="searchValKey" :condition="condition" style="height:calc(100vh - 6rem)">
			<template v-slot:rightTop = "allData">
				<uni-row class="demo-uni-row list-top-datapanel">
					<uni-col class="text-center text-blod" :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
						<view class="g-data-panel bg-white padding-lg shadow">
							<view class="padding text-red">{{listDataSum('order_amount',allData.allData)}}</view>
							<view class="padding text-bold">数量</view>
						</view>
					</uni-col>
					<uni-col class="text-center text-blod" :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
						<view class="g-data-panel bg-white  padding-lg shadow">
							<view class="padding text-red">￥{{listDataSum('sales',allData.allData)}}</view>
							<view class="padding text-bold">销售额</view>
						</view>
					</uni-col>
					<uni-col class="text-center text-blod" :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
						<view class="g-data-panel bg-white  padding-lg shadow">
							<view class="padding text-red">￥{{listDataSum('turnover',allData.allData)}}</view>
							<view class="padding text-bold">营业额</view>
						</view>
					</uni-col>
				</uni-row>
				<!-- <uni-row class="">
					<uni-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
						{{itemValue.item.create_time}}
					</uni-col>
					<uni-col class="text-right  text-blod" :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
						￥:{{itemValue.item.pay_amount}}<span class="text-red" v-if="itemValue.item.refund_amount">(退款:{{itemValue.item.refund_amount}})</span>
					</uni-col>
				</uni-row> -->
			</template>
			<template v-slot:rListItem = "itemValue">
				<!-- <uni-row class="demo-uni-row">
					<uni-col :xs="16" :sm="16" :md="16" :lg="16" :xl="16">
						订单编号：{{itemValue.item.order_no}}
					</uni-col>
					<uni-col class="text-right text-blod" :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
						{{itemValue.item.order_state}}
					</uni-col>
				</uni-row>
				<uni-row class="">
					<uni-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
						{{itemValue.item.create_time}}
					</uni-col>
					<uni-col class="text-right  text-blod" :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
						￥:{{itemValue.item.pay_amount}}<span class="text-red" v-if="itemValue.item.refund_amount">(退款:{{itemValue.item.refund_amount}})</span>
					</uni-col>
				</uni-row> -->
			</template>
			<template v-slot:rLayoutRight>
				
					<!-- <view class="list-detail"  @click="onItemChecked(detailData)">
						{{detailData}}
					</view> -->
					
			</template>
		</rList>
		
		<uni-popup ref="popup" type="dialog">
			<uni-popup-dialog type="info" title="确认操作"  @close="close" @confirm="confirm"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	
	import rList from '@/components/retail-list/retail-list.vue'
	export default {
		data() {
			return {
				config:{
					serviceName:"srvretail_staff_handover_select",
					listLayout:"listAndFilter",  // listAndDetail listAndFilter  list
					detailPath:"simple",  //  simple  基础的； 或者配置页面路由 路由格式待定
					page:{pageNo: 1, rownumber: 10},
					listHeaders:[''],
					showBatchSubmit:false,
					showTableDataPanel:[],   // 列表统计数据面板
					tabsType:"custom",   //
					custTabs:[{
					  "colName": "create_time",
					  "type": "between",
					  "inputType":"BetweenDate",
					  "parent": "",
					  "is_count": true,
					  "show_expr": {},
					  "label":"交班时间",
					  "showLabel":true,
					  "default": "",
					  "colspan":24,
					  "showAllTag": true
					},{
					  "colName": "staff_no",
					  "type": "Select",
					  "inputType":"#staff#",   // enum dict fk  store
					  "parent": "",
					  "is_count": false,
					  "show_expr": {},
					  "label":"员工",
					  "showLabel":true,
					  "colspan":24,
					  "default": "", 
					  "showAllTag": true,  
					  "tags":[],
					  "options":{},
					  "appendSearchButton":true
					}],
					tabs:{
						layout:'inline', // 'inline'   block
					}
				},
				detailData:null,
				condition:[],
				searchVal:"",
				searchValKey:"", // 查询的字段名  "col,col,col"
				columnRowConfig:[],
				gridActionQuery:null
			}
		},
		components:{
			rList
		},
		methods: {
			onItemChecked(e){
				console.log("onItemChecked",e)
				// this.detailData = JSON.stringify(e)
				this.toStockBatchSubmit(e)
			},
			toStockBatchSubmit(e){
				// let url = `/pages/main/stockmgt/stock-batch-submit?serviceName=srvretail_warehousing_update&type=update&id=${e.id}&title=${e.warehousing_no}&childKeyCol=warehousing_no`
				// if(e.warehousing_state == '已提交'){
				// 	url = `/pages/main/stockmgt/stock-batch-submit?serviceName=srvretail_warehousing_select&type=detail&id=${e.id}&title=${e.warehousing_no}&childKeyCol=warehousing_no`
				// }
				// uni.navigateTo({
				// 	url:url
				// })
			},
			requestBatchSubmit(){
				let self = this
				let e = this.gridActionQuery
				let datas = e.datas
				let req = []
				// if(e.type && e.type == 'batch-submit'){
				// 	let srv = this.config.serviceName.replace("select",'update')
				// 	let listData = datas.filter(item => item.warehousing_state == '待提交')
				// 	let ids = listData.map(item => item.id)
				// 	console.log(ids)
				// 	for(let id of ids){
				// 		req.push({
				// 			"serviceName": srv,
				// 			"condition": [
				// 				{
				// 					"colName": "id",
				// 					"ruleType": "eq",
				// 					"value": id
				// 				}
				// 			],
				// 			"data": [
				// 				{
				// 					"warehousing_state": "已提交"
				// 				}
				// 			]
				// 		})
				// 	}
				// 	self.$fetch('operate', srv, req).then((res) =>{
				// 		if(res.success){
				// 			uni.showToast({
				// 				icon:"none",
				// 				title:res.resultMessage
				// 			})
				// 			self.$refs.rList.reload()
				// 		}else{
				// 			uni.showToast({
				// 				icon:"none",
				// 				title:res.resultMessage
				// 			})
				// 		}
				// 	})
				// }
			},
			onGridButton(e){
				let self = this
				console.log('onGridButton',e)
				this.gridActionQuery = e
				this.open()
				
			},
			open() {
				this.$refs.popup.open()
			},
			/**
			 * 点击取消按钮触发
			 * @param {Object} done
			 */
			close() {
				// TODO 做一些其他的事情，before-close 为true的情况下，手动执行 close 才会关闭对话框
				// ...
				this.$refs.popup.close()
			},
			/**
			 * 点击确认按钮触发
			 * @param {Object} done
			 * @param {Object} value
			 */
			confirm(value) {
				// 输入框的值
				console.log(value)
				// TODO 做一些其他的事情，手动执行 close 才会关闭对话框
				// ...
				this.requestBatchSubmit()
				this.$refs.popup.close()
			}
		},
		onLoad(option) {
			console.log("option",option)
			this.config.serviceName = option.srv
			this.config.listLayout = option.listLayout
			this.config.pageType = option.pageType
			if(option.memberNo){
				this.condition.push({
					colName:'member_no',
					ruleType:'eq',
					value:option.memberNo
				})
			}
			
		},
		onShow(option) {
			this.gridActionQuery = null
			if(this.$refs.hasOwnProperty('rList')){
				
				this.$refs.rList.reload()
			}
			
		}
	}
</script>

<style lang="scss" scoped>
.list-detail{
	border-radius: 10rpx;
	background-color: #fff;
	box-shadow: #333;
}
.list-top-datapanel{
	uni-view{
		display: flex;
		justify-content: center;
		.g-data-panel{
			border-radius: 1rem;
			margin:2rem;
			width:20rem;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			align-items: center;
			font-size: 3rem;
		}
	}
	
}
</style>
